<script setup lang="ts">
import { onLoad, onReachBottom, onReady } from '@dcloudio/uni-app';
import ICard from '../components/card.vue';
import { apiFollowList } from '@/apis/follow';
import { ref, reactive } from 'vue';


let state = reactive({
  followList: [],
  total: 0, //总数
  pageNum: 1,
  pageSize: 10,
  isMore: false
})


const getApiFollowList = () => {
  let params = {
    pageNum: state.pageNum,
    pageSize: state.pageSize
  }
  apiFollowList(params).then(res => {
    state.total = res.total

    if (res.rows.length <= 0) {
      if (state.pageNum == 1) {
        state.followList = []
      }
      state.isMore = true;
      return false;
    }


    for (let i = 0; i < res.rows.length; i++) {
      state.followList.push(res.rows[i]);
    }

    // state.followList = res.rows
  });
}

onReachBottom((e: any) => {
  if (!state.isMore) {
    state.pageNum++;
  }
  state.pageNum++;
  getApiFollowList();
})

// onReady(() => {
//   getApiFollowList();
// })

onLoad(() => {
  getApiFollowList()
})
</script>
<template>
  <view class="main">
    <view class="my-fans">
      我的关注({{ state.total }}人)
    </view>
    <view class="fans-list">
      <ICard type="focus" :lists="state.followList" @childFollowList="getApiFollowList"></ICard>
    </view>
    <noneBox v-if="state.followList.length <= 0"></noneBox>
  </view>
</template>
<style scoped lang="scss">
.main {
  .my-fans {
    font-weight: 800;
    padding: 20rpx 40rpx;
    font-size: 28rpx;
  }

  .fans-list {
    background-color: #ffffff;
  }



}
</style>
